<!DOCTYPE html>
<html lang="zh-CN" xmlns:th="http://www.thymeleaf.org" xmlns="http://www.w3.org/1999/xhtml" xmlns:sec="http://www.thymeleaf.org/thymeleaf-extras-springsecurity4">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
<!--菜品详情模态框-->
<div class="modal fade" id="foodDetailModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" th:fragment="foodDetailModal">
    <div class="modal-dialog" role="document" style="width: 890px;height: 400px">
        <div class="modal-content">
            <div class="modal-body">
                <div class="container">
                    <div class="row">
                        <div class="col-md-4" id="foodImageModal" style="margin-left: -30px"></div>
                        <div class="col-md-5" id="foodRightDetailModal" style="margin-left:40px">
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
<!--头部-->
<nav class="navbar navbar-default navbar-fixed-top" th:fragment="headerBar">
    <div class="container-fluid">
        <div class="navbar-header" style="margin-left: 10px">
            <a class="navbar-brand" href="#">员工订餐系统</a>
        </div>

        <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
            <ul class="nav navbar-nav" style="margin-left: 50px">
                <li><a th:href="@{/user/index}">主页</a></li>
                <li><a th:href="@{/user/rice}" sec:authorize="hasRole('EMPLOYEE')">菜单</a></li>
                <li><a th:href="@{/user/rice}" sec:authorize="!isAuthenticated()">菜单</a></li>
                <li><a th:href="@{/user/foodSaleTop}">菜品售卖排行榜</a></li>
            </ul>
            <ul class="nav navbar-nav navbar-right" style="margin-right: 10px">
                <li class="top-buttonLi" th:if="${#httpServletRequest.remoteUser}" sec:authorize="hasRole('EMPLOYEE')"><button type="button" class="btn btn-primary" id="cartPageButton" style="background-color: #f04e4e;border-color: #f04e4e;margin-top:3px;">我的购物车</button></li>
                <li class="top-buttonLi"><button type="button" class="btn btn-primary" id="loginPageButton" th:unless="${#httpServletRequest.remoteUser}">登录</button></li>
                <li class="top-buttonLi"><button type="button" class="btn btn-info" id="registerPageButton" th:unless="${#httpServletRequest.remoteUser}">注册</button></li>
                <li class="dropdown" th:if="${#httpServletRequest.remoteUser}">
                    <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false"><span sec:authentication="name"></span><span class="caret"></span></a>
                    <ul class="dropdown-menu">
                        <li><a th:href="@{/user/userCenter}" sec:authorize="hasRole('EMPLOYEE')">个人中心</a></li>
                        <li><a th:href="@{/user/userCenter1}" sec:authorize="hasRole('TAKER')">个人中心</a></li>
                        <li><a th:href="@{/user/userCenter2}" sec:authorize="hasRole('ADMIN')">个人中心</a></li>
                        <li><a th:href="@{/admin/login}" sec:authorize="hasRole('EMPLOYEE')">后台管理系统登录</a></li>
                        <li><a th:href="@{/admin/login}" sec:authorize="hasRole('TAKER')">后台管理系统登录</a></li>
                        <li><a th:href="@{/admin/login}" sec:authorize="hasRole('ADMIN')">后台管理系统登录</a></li>
                        <li><a th:href="@{/admin/index}" sec:authorize="hasRole('SUPERADMIN')">后台管理系统</a></li>
                        <li sec:authorize="hasRole('TAKER')"><a th:href="@{/user/meal}">送餐员页面</a></li>
                        <li sec:authorize="hasRole('ADMIN')"><a th:href="@{/user/menu}">菜单管理</a></li>
                        <li role="separator" class="divider"></li>
                        <li><a href="#" th:href="@{/user/logout}">注销</a></li>
                    </ul>
                </li>
            </ul>
        </div>
    </div>
</nav>

<!--中间-->
<div class="container" style="min-height: 127px;margin-top:30px" th:fragment="contentBar">
    <!--内容-->
    <div class="row" style="min-height: 127px;">
        <div class="contentText">
            <div class="col-md-1 col-md-offset-1" style="background-color:#F9F6F0" id="contentLeft">
                <ul class="nav nav-pills nav-stacked">
                    <li role="presentation" class="contentMenu"><a th:href="@{/user/rice}"  th:class="${activeUri=='rice.html'?'leftContentText menuActive':'leftContentText'}" style="padding:10px 0 10px 0;">饭食</a></li>
                    <li role="presentation" class="contentMenu"><a th:href="@{/user/fenMian}" th:class="${activeUri=='fenmian.html'?'leftContentText menuActive':'leftContentText'}" style="padding:10px 0 10px 0;">粉面</a></li>
                    <li role="presentation" class="contentMenu"><a th:href="@{/user/pastry}" th:class="${activeUri=='pastry.html'?'leftContentText menuActive':'leftContentText'}" style="padding:10px 0 10px 0;">面点</a></li>
                    <li role="presentation" class="contentMenu"><a th:href="@{/user/drink}" th:class="${activeUri=='drink.html'?'leftContentText menuActive':'leftContentText'}" style="padding:10px 0 10px 0;">饮料小吃</a></li>
                </ul>
            </div>
            <div class="col-md-8" id="contentRight">
                <div class="row" id="food_list"></div>
                <!--菜品样本-->
                <!--<div class="col-sm-6 col-md-4">
                    <div class="thumbnail text-center">
                        <img th:src="@{/img/admin-login.jpg}">
                        <div class="caption">
                            <h4>食品1</h4>
                            <p><a href="#" class="btn btn-success" role="button">加入订单</a></p>
                        </div>
                    </div>
                </div>-->
                <div class="row text-center" id="food_page"></div>
            </div>
        </div>
    </div>
    <!--提醒-->
    <div class="row">
        <div class="col-md-12" style="text-align: center">
            送餐时间可能会推迟哦，到时候送餐员会电话联系您~
        </div>
    </div>
</div>


<!--尾部-->
<footer class="footer" style="margin-top: 50px" th:fragment="footerBar">
    <div class="container">
        <div class="row text-center" style=" background-color: #f5f5f5;">
            <p class="text-muted">© 2018-2019 小c公司 版权所有</p>
        </div>
    </div>
</footer>
</body>
</html>